<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
#trinagle {

width: 0;
height: 0;
/*
边框为非矩形,根据容器大小变化
*/

border: 20px solid white ;
border-top-color: black;

}

#trinagle-left {

width: 0;
height: 0;
/*
边框为非矩形,根据容器大小变化
*/

border: 20px solid white ;
border-left-color: black;

}

#trinagle-bottom {

width: 0;
height: 0;
/*
边框为非矩形,根据容器大小变化
*/

border: 20px solid white ;
border-bottom-color: black;

}

</style>
</head>

<body>

<!-- HTML注释 -->
<div id="trinagle">
</div>

<div id="trinagle-left">
</div>

<div id="trinagle-bottom">
</div>

</body>
</html>
